import calendarDayLess from "./calendarDay.module.less";
import { parseDate } from "@/utils/PublicFunction";
import { GetSentenceApi } from "@/http/api/signIn.ts";
import { useEffect, useState } from "react";
function CalendarDay(prop: any) {
  const [FquoteTitle, SetFquoteTitle] = useState("");
  const [FquoteSentence, SetFquoteSentence] = useState("");
  useEffect(() => {
    GetSentence();
  }, []);
  const GetSentence = async () => {
    const params = {
      Date: prop.DateString,
    };
    const res: any = await GetSentenceApi(params);
    console.log("获取到语录", res);
    if (res.status === 0) {
      SetFquoteTitle(res.FquoteTitle);
      SetFquoteSentence(res.FquoteSentence);
    }
  };
  return (
    <>
      <div className={calendarDayLess.calendarDay_content}>
        <div className="tin">
          <div className="block-one ellipse">
            <div className="inner-ellipse"></div>
          </div>
        </div>
        <div className="top_info">
          <div className="left_text">
            <div className="day">{parseDate(prop.DateString).day}</div>
            <div className="month_year">
              {parseDate(prop.DateString).month}{" "}
              {parseDate(prop.DateString).year}
            </div>
          </div>
          <div className="point">
            <div className="point_items"></div>
            <div className="point_items"></div>
          </div>
        </div>
        <div className="center_info">
          <div className="title">{FquoteTitle}</div>
          <div className="speech">{FquoteSentence}</div>
        </div>
        <div className="bottom_info">
          <div className="left">
            <div className="logo">
              <img
                src="https://lf3-cdn-tos.bytescm.com/obj/static/xitu_juejin_web/e08da34488b114bd4c665ba2fa520a31.svg"
                alt="稀土掘金logo"
              />
            </div>
            <div className="tips">扫描右侧二维码分享给好友</div>
          </div>
          <div className="right">
            <img src="/public/img/qr.png" alt="" />
          </div>
        </div>
      </div>
    </>
  );
}

export default CalendarDay;
